import { List, Modal } from 'antd';
import React, {useEffect, useState} from 'react';
import { ProTable } from '@ant-design/pro-components';
import ModifyPasswordModal from '@/pages/account/settings/components/ModifyPasswordModal ';

type Unpacked<T> = T extends (infer U)[] ? U : T;

const passwordStrength = {
  strong: <span className="strong">强</span>,
  medium: <span className="medium">中</span>,
  weak: <span className="weak">弱</span>,
};
export type PropTy = {
  passwordLevel: number;
};

const SecurityView: React.FC<PropTy> = (props) => {
  const [showModify, setShowModify] = useState<boolean>(false);
  const [strength, setStrength] = useState<boolean>(false);
  const handleChangePass = () => {
    setShowModify(true);
  };
  const handleCloseModify = () => {
    setShowModify(false);
  };
  useEffect(() => {
    setStrength(props.passwordLevel)
  }, [props]);

  const getData = () => [
    {
      title: '账户密码',
      description: (
        <>
          当前密码强度：
          {strength === 0
            ? passwordStrength.weak
            : strength === 1
            ? passwordStrength.medium
            : passwordStrength.strong}
        </>
      ),
      actions: [<a key="Modify" onClick={handleChangePass}>修改</a>],
    },
    {
      title: 'todo 备用邮箱',
      description: `已绑定邮箱：mak***lwx.com`,
      actions: [
        <a key="Modify" disabled={true} >
          修改
        </a>,
      ],
    },
  ];

    // eslint-disable-next-line @typescript-eslint/no-unused-expressions

  const getNewLevel=(data)=>{
    setStrength(data)
  }

  const data = getData();
  return (
    <>
      <List<Unpacked<typeof data>>
        itemLayout="horizontal"
        dataSource={data}
        renderItem={(item) => (
          <List.Item actions={item.actions}>
            <List.Item.Meta title={item.title} description={item.description} />
          </List.Item>
        )}
      />
      <ModifyPasswordModal showModify={showModify} onClose={handleCloseModify} getNewLevel={getNewLevel} />
    </>
  );
};

export default SecurityView;
